Component({

  behaviors: [],

  properties: {
    msgs: { // 属性名
      type: Array, // 类型（必填），目前接受的类型包括：String, Number, Boolean, Object, Array, null（表示任意类型）
      value: [], // 属性初始值（可选），如果未指定则会根据类型选择一个
      observer: function (newVal, oldVal) {
		  if(newVal.length>0){
			  this.setData({
				  doing:true
			  })
			  this.start()
		  }else{
			  this.setData({
			  		doing:false
			  })
		  }
	  } // 属性被改变时执行的函数（可选），也可以写成在methods段中定义的方法名字符串, 如：'_propertyChange'
    }
  },
  data: {
	  doing:false, // 是否循环中,
	  index:0 // 当前循环下标
  }, // 私有数据，可用于模版渲染
  ready: function() {
	  // if(this.data.msgs.length>0){
		 //  this.start()
	  // }
  },

  methods: {
	start(){
		this.setData({
			index:0,
			currentMsg:this.data.msgs[0]
		})
		this.doAnimation()
	},
	doAnimation(){
		// console.log('开始')
		this.animate('#target',[
			{opacity:1,top:'20rpx',left:'-100%'},
			{opacity:1,top:'20rpx',left:'20rpx'},
			{opacity:1,top:'20rpx',left:'20rpx'},
			{opacity:0.9,top:'20rpx',left:'20rpx'},
			{opacity:0,top:'-70rpx',left:'20rpx'}
		],4000,function(){
			this.clearAnimation('#target')
			if(!this.data.doing){
				return
			}
			let index=this.data.index
			if(index===this.data.msgs.length-1){
				index=0
			}else{
				index++
			}
			this.setData({
				index,
				currentMsg:this.data.msgs[index]
			})
			this.doAnimation()
			// console.log('第一次结束')
			// setTimeout(()=>{
			// 	// console.log('第二次开始')
			// 	this.animate('#target',[
			// 		{opacity:1,top:'20rpx'},
			// 		{opacity:0,top:'-70rpx'}
			// 	],1000,function(){
			// 		this.clearAnimation('#target')
			// 		if(!this.data.doing){
			// 			return
			// 		}
			// 		let index=this.data.index
			// 		if(index===this.data.msgs.length-1){
			// 			index=0
			// 		}else{
			// 			index++
			// 		}
			// 		this.setData({
			// 			index,
			// 			currentMsg:this.data.msgs[index]
			// 		})
			// 		this.doAnimation()
			// 	}.bind(this))
			// },2000)
		}.bind(this))
	}
  }

})